<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro" lang="zh" class="no-js">
    <head th:include="common_include :: commonHead('部门管理')"/>
    <body class="gray-bg">
        <div class="wrapper wrapper-content animated fadeInRight">
            <div class="row">
                <div class="col-sm-12">
                    <div class="ibox float-e-margins">
                        <div class="ibox-title">
                            <h5>部门管理</h5>
                        </div>
                        <div class="ibox-content">
                            <div class="row row-lg">
                                <div class="col-sm-12">
                                    <div class="row">
                                        <form id="query-form">
                                            <div class="col-sm-5">
                                                <div class="input-group m-b">
                                                    <span class="input-group-addon">部门名称</span>
                                                    <input type="text" name="deptName" id="deptName"
                                                           class="form-control" placeholder="部门名称">
                                                </div>
                                            </div>
                                            <div class="col-sm-2">
                                                <a class="btn btn-primary btn-rounded btn-sm"
                                                   onclick="$.treeTable.search('query-form')"><i
                                                        class="fa fa-search"></i>&nbsp;搜索
                                                </a>
                                            </div>
                                        </form>
                                    </div>
                                    <div class="btn-group hidden-xs" id="toolbar" role="group">
                                        <a class="btn btn-outline btn-success btn-rounded"
                                           shiro:hasPermission="upms:dept:add" onclick="$.operate.add(0)">
                                            <i class="fa fa-plus"></i>
                                            新增
                                        </a>
                                    </div>
                                    <div class="col-sm-12 select-info table-striped">
                                        <table id="bootstrap-table" data-mobile-responsive="true"></table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </body>
    <div th:include="common_include :: commonFoot"/>
    <script th:inline="javascript">
        $(function () {
            var addFlag = [[${@permission.displayWithPermission('upms:dept:add')}]];
            var editFlag = [[${@permission.displayWithPermission('upms:dept:edit')}]];
            var deleteFlag = [[${@permission.displayWithPermission('upms:dept:delete')}]];
            var dicts = [[${@dictCode.selectDictCodeByType('sys_normal_disable')}]];
            var prefix = ctx + "upms/dept";

            var options = {
                id: "rowKey",
                parentId: "pid",
                expandAll: false,
                url: prefix + "/list",
                createUrl: prefix + "/add/{id}",
                updateUrl: prefix + "/edit/{id}",
                removeUrl: prefix + "/delete",
                modalName: "部门",
                columns: [{
                    title: '部门名称',
                    field: 'deptName',
                    formatter: function (value, row, index) {
                        if (row.icon == null || row == "") {
                            return row.deptName;
                        } else {
                            return '<i class="' + row.icon + '"></i> <span class="nav-label">' + row.deptName + '</span>';
                        }
                    }
                }, {
                    field: 'sortNumber',
                    title: '排序',
                    align: "center"
                }, {
                    field: 'leader',
                    title: '负责人',
                    align: "center"
                }, {
                    field: 'phone',
                    title: '联系电话',
                    align: "center"
                }, {
                    field: 'email',
                    title: '电子邮箱',
                    align: "center",
                }, {
                    field: 'deptStatus',
                    title: '部门状态',
                    align: 'center',
                    formatter: function (value, row, index) {
                        return $.table.selectDictName(dicts, value);
                    }
                }, {
                    title: '操作',
                    width: '20%',
                    align: "center",
                    formatter: function (value, row, index) {
                        var actions = [];
                        actions.push('<a class="btn btn-success btn-xs ' + editFlag + ' " onclick="$.operate.edit(\'' + row.rowKey + '\')"><i class="fa fa-edit"></i>编辑</a> ');
                        actions.push('<a class="btn btn-info btn-xs ' + addFlag + '" onclick="$.operate.add(\'' + row.rowKey + '\')"><i class="fa fa-plus"></i>新增</a> ');
                        actions.push('<a class="btn btn-danger btn-xs ' + deleteFlag + '" onclick="$.operate.remove(\'' + row.rowKey + '\')"><i class="fa fa-remove"></i>删除</a>');
                        return actions.join('');
                    }
                }]
            };
            $.treeTable.init(options);
        });
    </script>
</html>